@charset "utf-8";*{padding:0;margin:0}

ul{list-style:none}
img{border:0;transition:all .3s linear}
input,select{font-size:12px;vertical-align:middle}
em,i{font-style:normal}
a{color:#111;text-decoration:none;transition:all .3s linear;-webkit-transition:all .3s linear}
a:hover{color:#123}

body{color:#555;font-family:"\5FAE\8F6F\96C5\9ED1","\82F9\679C\4E3D\4E2D\9ED1",Arial,Helvetica,sans-serif;font-size:13px;background-color:#f6f6f6;background-position:center 98px;background-repeat:repeat}


.cl{*zoom:1;}
.cl:after{display:block;overflow:hidden;clear:both;height:0;visibility:hidden;content:".";}
.clearfix {zoom:1;}
.clear{clear:both; width:0; height:0; overflow:hidden;}

.left{float:left; display:inline;}
.right{float:right; display:inline;}
.fl{float:left; display:inline;}
.fr{float:right; display:inline;}
.center{text-align:center;}

.bgGrey{background:#f5f5f5;}
.bgWhite{background:#fff;}
.more1{color:#7b0;font-size:10px;}




.w1190{width:1190px;margin:0 auto;overflow:hidden;}
.w1002{width:1002px;margin:0 auto;overflow:hidden;}
.w_left{width:843px;border:1px solid #e5e5e5;}
.w_right{width:252px;}

.fontsize_12{font-size:12px;}
.lineheight_24{line-height:24px;}


img{object-fit:cover;}

i.fa{color:#aaa}
.mcolor{color:#77bb00}


ul{list-style:none}
img{border:0;transition:all .3s linear}
input,select{font-size:12px;vertical-align:middle}
em,i{font-style:normal}
a{color:#111;text-decoration:none;transition:all .3s linear;-webkit-transition:all .3s linear}
a:hover{color:#123}

body{color:#555;font-family:"\5FAE\8F6F\96C5\9ED1","\82F9\679C\4E3D\4E2D\9ED1",Arial,Helvetica,sans-serif;font-size:13px;background-color:#f6f6f6;background-position:center 98px;background-repeat:repeat}


.section_has_shadow{
  width: 1444px;
  margin:0 auto;
}
.section{
  width: 1440px;
  margin:0 auto;
}
.section_left{
  /*width: 1220px;*/
  width: 980px;
  margin-right:20px;
  float:left;
}
.section_right{
  width: 440px;
  float:right;
}


@media (max-width: 575px) {
  .section{
    width: 570px;
  }
}
@media (max-width: 767px) {
  .section{
    width: 760px;
  }
}
@media (max-width: 991px) {
  .section{
    width: 990px;
  }
}
@media (max-width: 1199px) {
  .section{
    width: 1199px;
  }
}
@media (max-width: 1599px) {
  .section{
    width: 1440px;
  }
}



.shadow {
  box-shadow: 0 0 7px -4px #e5e5e5;
  border-radius: 16px;
}

.shadow_hover:hover {
  box-shadow: 0 0 7px 0 rgba(0, 0, 0, 0.15);
}
.wrap{width:1200px;min-width:1200px;margin:0 auto;overflow:hidden;}


.ellipsis-multiline {
  display: -webkit-box;
  box-orient: vertical;
  line-clamp: 4;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  line-clamp: 3;
  overflow: hidden;
  text-overflow: ellipsis;
}

.text-ellipsis {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  max-height: 4.5em; /* 行高 * 行数，这里的行高是3.0em，可以根据实际调整 */
  line-height: 1.5em;
  white-space: normal;
  text-align: left;:14px;word-wrap: break-word;
}

.text-ellipsis-line1 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  max-height: 4.5em; /* 行高 * 行数，这里的行高是3.0em，可以根据实际调整 */
  line-height: 1.5em;
  white-space: normal;
  text-align: left;:14px;word-wrap: break-word;
}


.text-ellipsis-line2 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  max-height:100%; /* 行高 * 行数，这里的行高是3.0em，可以根据实际调整 */
  line-height: 1.5em;
  white-space: normal;
  text-align: left;:14px;word-wrap: break-word;
}

.text-ellipsis-line3 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  max-height:100%; /* 行高 * 行数，这里的行高是3.0em，可以根据实际调整 */
  line-height: 1.5em;
  white-space: normal;
  text-align: left;:14px;word-wrap: break-word;
}

.text-ellipsis-line4 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  max-height: 6em; /* 行高 * 行数，这里的行高是3.0em，可以根据实际调整 */
  line-height: 1.5em;
  white-space: normal;
  text-align: left;:14px;word-wrap: break-word;
}

.text-ellipsis-line6 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  max-height: 9em; /* 行高 * 行数，这里的行高是3.0em，可以根据实际调整 */
  line-height: 1.5em;
  white-space: normal;
  text-align: left;:14px;word-wrap: break-word;
}

.wp100{width:100% !important;}
.w800{width:800px !important;}
.w400{width:400px !important;}
.w380{width:380px !important;}
.w330{width:330px !important;}
.w320{width:320px !important;}
.w318{width:318px !important;}
.w310{width:310px !important;}
.w300{width:300px !important;}
.w220{width:220px !important;}

.hp100{height:100% !important;}
.h40{height:40px !important;}
.h44{height:44px !important;}
.h60{height:60px !important;}
.h100{height:100px !important;}

.m0{margin:0 !important;}
.m5{margin:5px !important;}
.m10{margin:10px !important;}
.m15{margin:15px !important;}
.m20{margin:20px !important;}
.ml0{margin-left:0 !important;}
.ml5{margin-left:5px !important;}
.ml10{margin-left:10px !important;}
.ml15{margin-left:15px !important;}
.ml20{margin-left:20px !important;}
.mr0{margin-right:0 !important;}
.mr5{margin-right:5px !important;}
.mr10{margin-right:10px !important;}
.mr15{margin-right:15px !important;}
.mr20{margin-right:20px !important;}
.mb0{margin-bottom:0 !important;}
.mb5{margin-bottom:5px !important;}
.mb10{margin-bottom:10px !important;}
.mb15{margin-bottom:15px !important;}
.mb20{margin-bottom:20px !important;}
.mt0{margin-top:0 !important;}
.mt5{margin-top:5px !important;}
.mt10{margin-top:10px !important;}
.mt15{margin-top:15px !important;}
.mt20{margin-top:20px !important;}

.p0{padding:0 !important;}
.p5{padding:5px !important;}
.p10{padding:10px !important;}
.p15{padding:15px !important;}
.p20{padding:20px !important;}
.pl0{padding-left:0 !important;}
.pl5{padding-left:5px !important;}
.pl10{padding-left:10px !important;}
.pl15{padding-left:15px !important;}
.pl20{padding-left:20px !important;}
.pr0{padding-right:0 !important;}
.pr5{padding-right:5px !important;}
.pr10{padding-right:10px !important;}
.pr15{padding-right:15px !important;}
.pr20{padding-right:20px !important;}
.pb0{padding-bottom:0 !important;}
.pb5{padding-bottom:5px !important;}
.pb10{padding-bottom:10px !important;}
.pb15{padding-bottom:15px !important;}
.pb20{padding-bottom:20px !important;}
.pt0{padding-top:0 !important;}
.pt5{padding-top:5px !important;}
.pt10{padding-top:10px !important;}
.pt15{padding-top:15px !important;}
.pt20{padding-top:20px !important;}




.cl{*zoom:1;}
.cl:after{display:block;overflow:hidden;clear:both;height:0;visibility:hidden;content:".";}
.clearfix {zoom:1;}
.clear{clear:both; width:0; height:0; overflow:hidden;}

.left{float:left; display:inline;}
.right{float:right; display:inline;}
.fl{float:left; display:inline;}
.fr{float:right; display:inline;}
.center{text-align:center;}

.bgGrey{background:#f5f5f5;}
.bgWhite{background:#fff;}
.more1{color:#7b0;font-size:10px;}



.wrap{width:1190px;margin:0 auto;overflow:hidden;}
.w1190{width:1190px;margin:0 auto;overflow:hidden;}
.w1002{width:1002px;margin:0 auto;overflow:hidden;}
.w_left{width:843px;border:1px solid #e5e5e5;}
.w_right{width:252px;}


.fontsize12{font-size:12px !important;}
.fontsize14{font-size:14px !important;}
.fontsize16{font-size:16px !important;}
.fontsize18{font-size:18px !important;}

.fontsize_12{font-size:12px;}
.lineheight_24{line-height:24px;}


img{object-fit:cover;}

/* @font-face {
	font-family: 'PingFang-SC-Medium';
	src: url('static/PingFangMedium.ttf');
} */


/* CSS实现文本超过部分，超出两行，超出部分省略号显示 */
.ellipsis-multiline {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
}


page {
  background: #f7f7f7;
  font-size: 30upx;
  color: #383838;
}

html {
  /* background: #f4f4f4; */
  height: 100%;
}

* {
  margin: 0;
  box-sizing: border-box;
}

body {
  margin: 0;
  font-size: 30upx;
  color: #383838;
  /* height: 100%; */

  /* font-family: PingFang-SC-Medium Helvetica Neue, Helvetica, STHeiTi, Arial, sans-serif; */
  font-family: PingFangSC-Regular, PingFang SC, Microsoft YaHei, -apple-system, Helvetica, sans-serif;

  /* Status bar height on iOS 11.0 */
  /* padding-top: constant(safe-area-inset-top); */
  padding-bottom: constant(safe-area-inset-bottom);
  /* Status bar height on iOS 11+ */
  /* padding-top: env(safe-area-inset-top); */
  /* padding-bottom: env(safe-area-inset-bottom); */
  padding-left: constant(safe-area-inset-left);
  padding-right: constant(safe-area-inset-right);
  /* backgroup-color: #000; */

}
uni-page-body {
  height: 100%;
}

::-webkit-scrollbar {
  display: none;
}

input {
  background: transparent;
  border: none;
}

input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
  background-color: transparent !important;
  background-image: none !important;
  color: rgb(0, 0, 0) !important;
}

.contain {
  padding: 0px 0 0px 0;
  height: 100%;
  /* height: 100vh; */
}

uni-image,
image {
  height: auto;
}
/************************************************************
** 请将全局样式拷贝到项目的全局 CSS 文件或者当前页面的顶部 **
** 否则页面将无法正常显示                                  **
************************************************************/

html {
  font-size: 16px;
}

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans',
  'Droid Sans', 'Helvetica Neue', 'Microsoft Yahei', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

view {
  box-sizing: border-box;
  flex-shrink: 0;
}

#app {
  width: 100vw;
  height: 100vh;
}

.flex-row {
  display: flex;
  flex-direction: row;
}

.flex-col {
  display: flex;
  flex-direction: column;
}

.justify-start {
  justify-content: flex-start;
}

.justify-end {
  justify-content: flex-end;
}

.justify-center {
  justify-content: center;
}

.justify-between {
  justify-content: space-between;
}

.justify-around {
  justify-content: space-around;
}

.justify-evenly {
  justify-content: space-evenly;
}

.items-start,.align-start {
  align-items: flex-start;
}

.items-end,.align-end {
  align-items: flex-end;
}

.items-center,.align-center {
  align-items: center;
}

.items-baseline,.align-baseline {
  align-items: baseline;
}

.items-stretch,.align-stretch {
  align-items: stretch;
}

.self-start {
  align-self: flex-start;
}

.self-end {
  align-self: flex-end;
}

.self-center {
  align-self: center;
}

.self-baseline {
  align-self: baseline;
}

.self-stretch {
  align-self: stretch;
}

.flex-1 {
  flex: 1 1 0%;
}

.flex-auto {
  flex: 1 1 auto;
}

.grow {
  flex-grow: 1;
}

.grow-0 {
  flex-grow: 0;
}

.shrink {
  flex-shrink: 1;
}

.shrink-0 {
  flex-shrink: 0;
}

.relative {
  position: relative;
}
.grid {
  display: grid;
}
.grid-c-2 {
  grid-template-columns: 1fr 1fr;
}
.grid-c-3 {
  grid-template-columns: 1fr 1fr 1fr;
}
.grid-c-4 {
  grid-template-columns: 1fr 1fr 1fr 1fr;
}
.grid-c-5 {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
.grid-g2 {
  gap: 2px;
}
.grid-g10 {
  gap: 10px;
}
.grid-g20 {
  gap: 20px;
}
.flex {
  display: -webkit-box!important;
  display: -webkit-flex!important;;
  display: -moz-box!important;;
  display: -ms-flexbox!important;;
  display: -o-flex!important;;
  display: flex!important;;
}

.flex-1 {
  -prefix-box-flex: 1!important;;
  -webkit-box-flex: 1!important;;
  -webkit-flex: 1!important;;
  -moz-box-flex: 1!important;;
  -ms-flex: 1!important;;
  flex: 1!important;;
}






.f-a-c {
  -webkit-align-items: center!important;;
  -moz-align-items: center!important;;
  -ms-align-items: center!important;;
  -o-align-items: center!important;;
  align-items: center!important;;
}

.f-a-e {
  -webkit-align-items: flex-end!important;;
  -moz-align-items: flex-end!important;;
  -ms-align-items: flex-end!important;;
  -o-align-items: flex-end!important;;
  align-items: flex-end!important;;
}

.f-a-s {
  -webkit-align-items: flex-start;
  -moz-align-items: flex-start;
  -ms-align-items: flex-start;
  -o-align-items: flex-start;
  align-items: flex-start!important;
}



.f-j-sa {
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -ms-justify-content: flex-start;
  -o-justify-content: flex-start;
  justify-content: space-around!important;
}

.f-j-c {
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  justify-content: center!important;
}



.f-j-start {
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -ms-justify-content: flex-start;
  -o-justify-content: flex-start;
  justify-content: flex-start!important;
}

.f-j-s {
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -ms-justify-content: space-between;
  -o-justify-content: space-between;
  justify-content: space-between!important;;
}
.f-j-b {
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -ms-justify-content: space-between;
  -o-justify-content: space-between;
  justify-content: space-between!important;;
}

.f-j-e {
  -webkit-justify-content: flex-end;
  -moz-justify-content: flex-end;
  -ms-justify-content: flex-end;
  -o-justify-content: flex-end;
  justify-content: flex-end!important;;
}

.f-c {
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column!important;;
}
.f-r {
  flex-direction: row!important;
}

.f-n {
  -webkit-flex-wrap: nowrap;
  -moz-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  -o-flex-wrap: nowrap;
  flex-wrap: nowrap!important;;
}

.f-w {
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -o-flex-wrap: wrap;
  flex-wrap: wrap!important;;
}

.f-s-0 {
  -webkit-flex-shrink: 0;
  -moz-flex-shrink: 0;
  -ms-flex-shrink: 0;
  -o-flex-shrink: 0;
  flex-shrink: 0!important;;
}

.f-s-1 {
  -webkit-flex-shrink: 1;
  -moz-flex-shrink: 1;
  -ms-flex-shrink: 1;
  -o-flex-shrink: 1;
  flex-shrink: 1!important;;
}

.line3 {
  display: -webkit-box!important;
  -webkit-box-orient: vertical!important;
  -webkit-line-clamp: 3;
  overflow: hidden;
  word-break: break-all;
}

.line2 {
  display: -webkit-box!important;
  -webkit-box-orient: vertical!important;
  -webkit-line-clamp: 2;
  overflow: hidden;
  word-break: break-all;
}

.line1 {
  display: -webkit-box!important;
  -webkit-box-orient: vertical!important;
  -webkit-line-clamp: 1;
  overflow: hidden;
  word-break: break-all;
}
.safe-area {
  padding-bottom: 0;
  padding-bottom: constant(safe-area-inset-bottom);
  padding-bottom: env(safe-area-inset-bottom);
  background-color: #fff;
  padding:0 15px 15px 15px;
}

.no-more {
  color: #ccc;
  font-size: 12px;
  margin-top: 20px;
}

.no-more::before,
.no-more::after {
  content: '';
  width: 60px;
  display: flex;
  border-bottom: 1px solid #ccc;
  position: relative;
  margin: 0px 2px 0;
  transform: scale(0.5);
}


*::not(input, textarea) {
  -webkit-touch-callout: auto;
  /*系统默认菜单被禁用*/
  -webkit-user-select: auto;
  /*webkit浏览器*/
  -khtml-user-select: auto;
  /*早期浏览器*/
  -moz-user-select: auto;
  /*火狐*/
  -ms-user-select: auto;
  /*IE10*/
  user-select: auto;

}

input,
textarea {
  -webkit-user-select: auto;
  /*webkit浏览器*/
  margin: 0px;
  padding: 0px;
  outline: none;
}


.van-toast {
  z-index: 99999 !important;
}

.van-overflow-hidden {
  height: 100vh;
}

/deep/uni-view {
  line-height: none;
}
view {
  word-break: break-all;
  box-sizing: border-box;
}
scroll-view {
  box-sizing: border-box;
}

.uni-popup {
  z-index: 9999 !important;
}

/deep/ .uni-picker-container {
  z-index: 999999 !important;
}

/deep/ uni-input {
  font-size: 14px;
}

/deep/ .s-tab-line {
  background: linear-gradient(180deg, #DA2A1C 0%, #EF543C 100%) !important;

  border-radius: 6px;
  bottom: 11px !important;
}

/deep/ .s-tab-nav {
  position: relative;
  font-weight: bold;
  z-index: 1;
}

.no-data {
  text-align: center;
  padding: 120px 0 50px 0;
}

.no-data image {
  width: 150px;
  margin: 0 auto 6px;
}


.wrap-pay-key {
  position: fixed;
  top: 10vh;
  left: 0;
  right: 0;
  margin: auto;
  width: 80%;
  border-radius: 8px;
  z-index: 99999;
}

/deep/ .keyboar {
  width: 25% !important;
}

.b-bottom {
  border-bottom: 1px solid #f4f4f4;
}

button {
  padding: 0;
  font-size: 14px;
  background-color: transparent;
  line-height: unset;
  border: none;
}

button::after {
  display: none;
}

uni-toast {
  z-index: 1000000000 !important;
}

.uni-noticebar,
/deep/ .uni-noticebar {
  margin-bottom: 0 !important;
}

.uni-noticebar__content-text,
.uni-noticebar__content-text {
  font-size: 12px !important;
}

.wrap-tabbar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: 50px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0px -1px 10px 0px rgba(188, 188, 188, 0.5);
  border-radius: 20px 20px 0px 0px;
  box-sizing: content-box;
  z-index: 1111;
}

.wrap-layout {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.7);
  z-index: 1112;
}

.fixed-top {
  position: fixed!important;
  top: 0;
  left: 0;
  right: 0;
  z-index: 111;
  box-sizing: content-box;
}

.text-price::before {
  content: "¥";
  font-size: 80%;
  margin-right: 2px;
}
.text-price-role::after {
  content: "积分";
  font-size: 70%;
  margin-left: 2px;
}

.wrap-tuijian-title::before,
.wrap-tuijian-title::after {
  content: '';
  width: 30px;
  border-bottom: 1px solid #ccc;
  position: relative;
  margin: 0px 12px 0;
}
.input {
  width: 100%;
  height: 100%;
}
.add-btn,.add-num,.add-reduce {
  width: 28px;
  height: 28px;
  border-radius: 2px;
  background-color: #F2F2F2;
}
.add-num {
  width: 38px;
  padding: 0 2px;
  margin: 0 2px;
  font-size: 13px;
  font-weight: bold;
}
.add-btn::after {
  content: "\e735";
  font-family: "van-icon" !important;
}
.add-reduce::after {
  content: "\e71f";
  font-family: "van-icon" !important;
}
.add-reduce.dis::after,.add-btn.dis::after {
  color: #b8b8b8;
}
.wrap-popup-radius {
  border-radius: 15px 15px 0 0;
}





.flex-row {
  display: flex;
  flex-direction: row;
}

.flex-col {
  display: flex;
  flex-direction: column;
}



.ads3 > view:not(:first-child),
.ads3 > text:not(:first-child),
.ads3 > image:not(:first-child) {
  margin-left: 20rpx;
}
.ads3  .image {
  flex:2;
  /* flex: 1 1 346rpx; */
  /* width: 346rpx; */
  /* height: 520rpx; */
}

.ads3  .ads3-left > view:not(:first-child),
.ads3  .ads3-left > text:not(:first-child),
.ads3-left > image:not(:first-child) {
  margin-top: 20rpx;
}
.ads3 .ads3-left  .image {
  flex:6;
  width: 400rpx;
  /* height: 250rpx; */
}
.ads3 .ads3-left  .image_2 {
  flex:6;
  width: 346rpx;
  /* height: 250rpx; */
}




/*  -- 内外边距 -- */

.margin-0 {
  margin: 0;
}

.margin-xs {
  margin: 10upx;
}

.margin-sm {
  margin: 20upx;
}

.margin {
  margin: 30upx;
}

.margin-lg {
  margin: 40upx;
}

.margin-xl {
  margin: 50upx;
}

.margin-top-xs {
  margin-top: 10upx;
}

.margin-top-sm {
  margin-top: 20upx;
}

.margin-top {
  margin-top: 30upx;
}

.margin-top-lg {
  margin-top: 40upx;
}

.margin-top-xl {
  margin-top: 50upx;
}

.margin-right-xs {
  margin-right: 10upx;
}

.margin-right-sm {
  margin-right: 20upx;
}

.margin-right {
  margin-right: 30upx;
}

.margin-right-lg {
  margin-right: 40upx;
}

.margin-right-xl {
  margin-right: 50upx;
}

.margin-bottom-xs {
  margin-bottom: 10upx;
}

.margin-bottom-sm {
  margin-bottom: 20upx;
}

.margin-bottom {
  margin-bottom: 30upx;
}

.margin-bottom-lg {
  margin-bottom: 40upx;
}

.margin-bottom-xl {
  margin-bottom: 50upx;
}

.margin-left-xs {
  margin-left: 10upx;
}

.margin-left-sm {
  margin-left: 20upx;
}

.margin-left {
  margin-left: 30upx;
}

.margin-left-lg {
  margin-left: 40upx;
}

.margin-left-xl {
  margin-left: 50upx;
}

.margin-lr-xs {
  margin-left: 10upx;
  margin-right: 10upx;
}

.margin-lr-sm {
  margin-left: 20upx;
  margin-right: 20upx;
}

.margin-lr {
  margin-left: 30upx;
  margin-right: 30upx;
}

.margin-lr-lg {
  margin-left: 40upx;
  margin-right: 40upx;
}

.margin-lr-xl {
  margin-left: 50upx;
  margin-right: 50upx;
}

.margin-tb-xs {
  margin-top: 10upx;
  margin-bottom: 10upx;
}

.margin-tb-sm {
  margin-top: 20upx;
  margin-bottom: 20upx;
}

.margin-tb {
  margin-top: 30upx;
  margin-bottom: 30upx;
}

.margin-tb-lg {
  margin-top: 40upx;
  margin-bottom: 40upx;
}

.margin-tb-xl {
  margin-top: 50upx;
  margin-bottom: 50upx;
}

.padding-0 {
  padding: 0;
}

.padding-xs {
  padding: 10upx;
}

.padding-sm {
  padding: 20upx;
}

.padding {
  padding: 30upx;
}

.padding-lg {
  padding: 40upx;
}

.padding-xl {
  padding: 50upx;
}

.padding-top-xs {
  padding-top: 10upx;
}

.padding-top-sm {
  padding-top: 20upx;
}

.padding-top {
  padding-top: 30upx;
}

.padding-top-lg {
  padding-top: 40upx;
}

.padding-top-xl {
  padding-top: 50upx;
}

.padding-right-xs {
  padding-right: 10upx;
}

.padding-right-sm {
  padding-right: 20upx;
}

.padding-right {
  padding-right: 30upx;
}

.padding-right-lg {
  padding-right: 40upx;
}

.padding-right-xl {
  padding-right: 50upx;
}

.padding-bottom-xs {
  padding-bottom: 10upx;
}

.padding-bottom-sm {
  padding-bottom: 20upx;
}

.padding-bottom {
  padding-bottom: 30upx;
}

.padding-bottom-lg {
  padding-bottom: 40upx;
}

.padding-bottom-xl {
  padding-bottom: 50upx;
}

.padding-left-xs {
  padding-left: 10upx;
}

.padding-left-sm {
  padding-left: 20upx;
}

.padding-left {
  padding-left: 30upx;
}

.padding-left-lg {
  padding-left: 40upx;
}

.padding-left-xl {
  padding-left: 50upx;
}

.padding-lr-xs {
  padding-left: 10upx;
  padding-right: 10upx;
}

.padding-lr-sm {
  padding-left: 20upx;
  padding-right: 20upx;
}

.padding-lr {
  padding-left: 30upx;
  padding-right: 30upx;
}

.padding-lr-lg {
  padding-left: 40upx;
  padding-right: 40upx;
}

.padding-lr-xl {
  padding-left: 50upx;
  padding-right: 50upx;
}

.padding-tb-xs {
  padding-top: 10upx;
  padding-bottom: 10upx;
}

.padding-tb-sm {
  padding-top: 20upx;
  padding-bottom: 20upx;
}

.padding-tb {
  padding-top: 30upx;
  padding-bottom: 30upx;
}

.padding-tb-lg {
  padding-top: 40upx;
  padding-bottom: 40upx;
}

.padding-tb-xl {
  padding-top: 50upx;
  padding-bottom: 50upx;
}

/* -- 浮动 --  */

.cf::after,
.cf::before {
  content: " ";
  display: table;
}

.cf::after {
  clear: both;
}

.fl {
  float: left;
}

.fr {
  float: right;
}

/* ==================
          背景
 ==================== */

.line-red::after,
.lines-red::after {
  border-color: #e54d42;
}

.line-orange::after,
.lines-orange::after {
  border-color: #f37b1d;
}

.line-yellow::after,
.lines-yellow::after {
  border-color: #fbbd08;
}

.line-olive::after,
.lines-olive::after {
  border-color: #8dc63f;
}

.line-green::after,
.lines-green::after {
  border-color: #fa436a;
}

.line-cyan::after,
.lines-cyan::after {
  border-color: #1cbbb4;
}

.line-blue::after,
.lines-blue::after {
  border-color: #0081ff;
}

.line-purple::after,
.lines-purple::after {
  border-color: #6739b6;
}

.line-mauve::after,
.lines-mauve::after {
  border-color: #9c26b0;
}

.line-pink::after,
.lines-pink::after {
  border-color: #e03997;
}

.line-brown::after,
.lines-brown::after {
  border-color: #a5673f;
}

.line-grey::after,
.lines-grey::after {
  border-color: #8799a3;
}

.line-gray::after,
.lines-gray::after {
  border-color: #aaaaaa;
}

.line-black::after,
.lines-black::after {
  border-color: #333333;
}

.line-white::after,
.lines-white::after {
  border-color: #ffffff;
}

.bg-red {
  background-color: #e54d42;
  color: #ffffff;
}

.bg-orange {
  background-color: #f37b1d;
  color: #ffffff;
}

.bg-yellow {
  background-color: #fbbd08;
  color: #333333;
}

.bg-olive {
  background-color: #8dc63f;
  color: #ffffff;
}

.bg-green {
  background-color: #39b54a;
  color: #ffffff;
}

.bg-cyan {
  background-color: #1cbbb4;
  color: #ffffff;
}

.bg-blue {
  background-color: #0081ff;
  color: #ffffff;
}

.bg-purple {
  background-color: #6739b6;
  color: #ffffff;
}

.bg-mauve {
  background-color: #9c26b0;
  color: #ffffff;
}

.bg-pink {
  background-color: #e03997;
  color: #ffffff;
}

.bg-brown {
  background-color: #a5673f;
  color: #ffffff;
}

.bg-grey {
  background-color: #8799a3;
  color: #ffffff;
}

.bg-gray {
  background-color: #f0f0f0;
  color: #333333;
}

.bg-black {
  background-color: #333333;
  color: #ffffff;
}

.bg-white {
  background-color: #ffffff;
  color: #666666;
}

.bg-rf {
  background-color: #fa436a;
  color: #ffffff;
}

.bg-shadeTop {
  background-image: linear-gradient(rgba(0, 0, 0, 1), rgba(0, 0, 0, 0.01));
  color: #ffffff;
}

.bg-shadeBottom {
  background-image: linear-gradient(rgba(0, 0, 0, 0.01), rgba(0, 0, 0, 1));
  color: #ffffff;
}

.bg-red.light {
  color: #e54d42;
  background-color: #fadbd9;
}

.bg-orange.light {
  color: #f37b1d;
  background-color: #fde6d2;
}

.bg-yellow.light {
  color: #fbbd08;
  background-color: #fef2ced2;
}

.bg-olive.light {
  color: #8dc63f;
  background-color: #e8f4d9;
}

.bg-green.light {
  color: #fa436a;
  background-color: #d7f0dbff;
}

.bg-cyan.light {
  color: #1cbbb4;
  background-color: #d2f1f0;
}

.bg-blue.light {
  color: #0081ff;
  background-color: #cce6ff;
}

.bg-purple.light {
  color: #6739b6;
  background-color: #e1d7f0;
}

.bg-mauve.light {
  color: #9c26b0;
  background-color: #ebd4ef;
}

.bg-pink.light {
  color: #e03997;
  background-color: #f9d7ea;
}

.bg-brown.light {
  color: #a5673f;
  background-color: #ede1d9;
}

.bg-grey.light {
  color: #8799a3;
  background-color: #e7ebed;
}

.bg-gradual-red {
  background-image: linear-gradient(45deg, #f43f3b, #ec008c);
  color: #ffffff;
}

.bg-gradual-orange {
  background-image: linear-gradient(45deg, #ff9700, #ed1c24);
  color: #ffffff;
}

.bg-gradual-green {
  background-image: linear-gradient(45deg, #fa436a, #8dc63f);
  color: #ffffff;
}

.bg-gradual-purple {
  background-image: linear-gradient(45deg, #9000ff, #5e00ff);
  color: #ffffff;
}

.bg-gradual-pink {
  background-image: linear-gradient(45deg, #ec008c, #6739b6);
  color: #ffffff;
}

.bg-gradual-blue {
  background-image: linear-gradient(45deg, #0081ff, #1cbbb4);
  color: #ffffff;
}

.shadow[class*="-red"] {
  box-shadow: 6upx 6upx 8upx rgba(204, 69, 59, 0.2);
}

.shadow[class*="-orange"] {
  box-shadow: 6upx 6upx 8upx rgba(217, 109, 26, 0.2);
}

.shadow[class*="-yellow"] {
  box-shadow: 6upx 6upx 8upx rgba(224, 170, 7, 0.2);
}

.shadow[class*="-olive"] {
  box-shadow: 6upx 6upx 8upx rgba(124, 173, 55, 0.2);
}

.shadow[class*="-green"] {
  box-shadow: 6upx 6upx 8upx rgba(48, 156, 63, 0.2);
}

.shadow[class*="-cyan"] {
  box-shadow: 6upx 6upx 8upx rgba(28, 187, 180, 0.2);
}

.shadow[class*="-blue"] {
  box-shadow: 6upx 6upx 8upx rgba(0, 102, 204, 0.2);
}

.shadow[class*="-purple"] {
  box-shadow: 6upx 6upx 8upx rgba(88, 48, 156, 0.2);
}

.shadow[class*="-mauve"] {
  box-shadow: 6upx 6upx 8upx rgba(133, 33, 150, 0.2);
}

.shadow[class*="-pink"] {
  box-shadow: 6upx 6upx 8upx rgba(199, 50, 134, 0.2);
}

.shadow[class*="-brown"] {
  box-shadow: 6upx 6upx 8upx rgba(140, 88, 53, 0.2);
}

.shadow[class*="-grey"] {
  box-shadow: 6upx 6upx 8upx rgba(114, 130, 138, 0.2);
}

.shadow[class*="-gray"] {
  box-shadow: 6upx 6upx 8upx rgba(114, 130, 138, 0.2);
}

.shadow[class*="-black"] {
  box-shadow: 6upx 6upx 8upx rgba(26, 26, 26, 0.2);
}

.shadow[class*="-white"] {
  box-shadow: 6upx 6upx 8upx rgba(26, 26, 26, 0.2);
}

.text-shadow[class*="-red"] {
  text-shadow: 6upx 6upx 8upx rgba(204, 69, 59, 0.2);
}

.text-shadow[class*="-orange"] {
  text-shadow: 6upx 6upx 8upx rgba(217, 109, 26, 0.2);
}

.text-shadow[class*="-yellow"] {
  text-shadow: 6upx 6upx 8upx rgba(224, 170, 7, 0.2);
}

.text-shadow[class*="-olive"] {
  text-shadow: 6upx 6upx 8upx rgba(124, 173, 55, 0.2);
}

.text-shadow[class*="-green"] {
  text-shadow: 6upx 6upx 8upx rgba(48, 156, 63, 0.2);
}

.text-shadow[class*="-cyan"] {
  text-shadow: 6upx 6upx 8upx rgba(28, 187, 180, 0.2);
}

.text-shadow[class*="-blue"] {
  text-shadow: 6upx 6upx 8upx rgba(0, 102, 204, 0.2);
}

.text-shadow[class*="-purple"] {
  text-shadow: 6upx 6upx 8upx rgba(88, 48, 156, 0.2);
}

.text-shadow[class*="-mauve"] {
  text-shadow: 6upx 6upx 8upx rgba(133, 33, 150, 0.2);
}

.text-shadow[class*="-pink"] {
  text-shadow: 6upx 6upx 8upx rgba(199, 50, 134, 0.2);
}

.text-shadow[class*="-brown"] {
  text-shadow: 6upx 6upx 8upx rgba(140, 88, 53, 0.2);
}

.text-shadow[class*="-grey"] {
  text-shadow: 6upx 6upx 8upx rgba(114, 130, 138, 0.2);
}

.text-shadow[class*="-gray"] {
  text-shadow: 6upx 6upx 8upx rgba(114, 130, 138, 0.2);
}

.text-shadow[class*="-black"] {
  text-shadow: 6upx 6upx 8upx rgba(26, 26, 26, 0.2);
}

.bg-img {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.bg-mask {
  background-color: #333333;
  position: relative;
}

.bg-mask::after {
  content: "";
  border-radius: inherit;
  width: 100%;
  height: 100%;
  display: block;
  background-color: rgba(0, 0, 0, 0.4);
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
}

.bg-mask view,
.bg-mask cover-view {
  z-index: 5;
  position: relative;
}

.bg-video {
  position: relative;
}

.bg-video video {
  display: block;
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  position: absolute;
  top: 0;
  z-index: 0;
  pointer-events: none;
}

/* ==================
          文本
 ==================== */

.text-xs {
  font-size: 20upx;
}

.text-sm {
  font-size: 24upx;
}

.text-df {
  font-size: 28upx;
}

.text-lg {
  font-size: 32upx;
}

.text-xl {
  font-size: 36upx;
}

.text-xxl {
  font-size: 44upx;
}

.text-sl {
  font-size: 80upx;
}

.text-xsl {
  font-size: 120upx;
}

.text-Abc {
  text-transform: Capitalize;
}

.text-ABC {
  text-transform: Uppercase;
}

.text-abc {
  text-transform: Lowercase;
}

.text-price::before {
  content: "¥";
  font-size: 80%;
  margin-right: 4upx;
}

.text-cut {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.text-bold {
  font-weight: bold;
}

.text-center {
  text-align: center;
}

.text-content {
  line-height: 1.6;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.text-red,
.line-red,
.lines-red {
  color: #e54d42;
}

.text-orange,
.line-orange,
.lines-orange {
  color: #f37b1d;
}

.text-yellow,
.line-yellow,
.lines-yellow {
  color: #fbbd08;
}

.text-olive,
.line-olive,
.lines-olive {
  color: #8dc63f;
}

.text-green,
.line-green,
.lines-green {
  color: #39b54a;
}

.text-cyan,
.line-cyan,
.lines-cyan {
  color: #1cbbb4;
}

.text-blue,
.line-blue,
.lines-blue {
  color: #0081ff;
}

.text-purple,
.line-purple,
.lines-purple {
  color: #6739b6;
}

.text-mauve,
.line-mauve,
.lines-mauve {
  color: #9c26b0;
}

.text-pink,
.line-pink,
.lines-pink {
  color: #e03997;
}

.text-brown,
.line-brown,
.lines-brown {
  color: #a5673f;
}

.text-grey,
.line-grey,
.lines-grey {
  color: #8799a3;
}

.text-gray,
.line-gray,
.lines-gray {
  color: #aaaaaa;
}

.text-black,
.line-black,
.lines-black {
  color: #333333;
}

.text-white,
.line-white,
.lines-white {
  color: #ffffff;
}

.text-rf,
.line-rf,
.lines-rf {
  color: #fa436a;
}




.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
  z-index: 3;
  color: #000000 !important;
  cursor: default;
  background-color: #000000 !important;
  border-color: #000000 !important;
}

.pagination > li > a, .pagination > li > span {
  position: relative;
  float: left;
  padding: 6px 12px;
  margin-left: -1px;
  line-height: 1.42857143;
  color: #000000 !important;
  text-decoration: none;
  background-color: #fff;
  border: 1px solid #ddd;
}


.pagination > li.active > a{
  color: #ffffff !important;
}
.pagination  .go-page{
  color: #fff !important;
}
